<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>首页</title>
    <link rel="stylesheet" href="">
</head>

<body>
    <header id="the_header" class="clz_header">
        <div id="mine_header_1">
            <div class="mine_header_div2">
                <div class="title_i_div head_div" id="title_header">
                    <i>AllStarGH</i>
                </div>
                <div class="a_header_div mine_a_div head_div">
                    <div class="address_div head_div">
                        <div class="target_a_div mine_header_div mine_header_a_div">
                            <a href="#">登录</a>
                        </div>
                        <div class="target_a_div mine_header_div mine_header_a_div">
                            <a href="#">注册</a>
                        </div>
                        <div class="target_a_div mine_header_div mine_header_a_div" id="special_target_div">
                            <a href="#">改名并迁徙bilibili视频</a>
                        </div>
                        <div class="mine_header_div mine_header_a_div">
                            <a href="#">图片处理</a>
                        </div>
                    </div>
                </div>
            </div>
    </header>
    <main id="mine_main">
        <div class="welcome2" id="welcome_2">
            <h1>Welcome to My React's Engineering</h1>
        </div>
    </main>
    <footer id="mine_footer">
        <div class="footer_div_01">
            Copy Right by @AllStarGH
        </div>
    </footer>
</body>

</html>
<style type="text/css" media="screen">
.footer_div_01 {
    text-align: end;
    transform: translate(-18px, 20px);
}

.mine_header_div>a {
    color: #ffffff;
    text-underline-position: under;
}

body {
    display: block;
    margin: 0px;
}

#mine_header_1 {
    height: 45px;
    padding: 15px 0px;
    left: 0px;
    color: #fff;
    background: #1e2b31;
}

#the_header {
    position: fixed;
    top: 0;
    height: 50px;
    width: 100%;
}

#mine_footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 60px;
    background: #1e2b31;
    color: #fff;
    left: 0px;
}

.address_div {
    width: 60%;
    position: fixed;
    right: 22px;
}

#welcome_2 {
    text-align: center;
    margin: 7em 0;
}

.mine_header_a_div,
.head_div {
    display: inline;
}

.mine_a_div {
    text-align: right;
    width: 60%;
}

#title_header {
    margin: 0 0 0 2em;
}

.target_a_div {
    margin: 0 22px;
}

#special_target_div {
    margin: 0 44px 0 22px;
}
</style>